Skip to content

feat: show copyable invite link in pending invites list (#239)#240

Merged
zacharias-ona merged 2 commits into
mainfrom
feat/239-invite-copy-link
Apr 19, 2026
Merged

feat: show copyable invite link in pending invites list (#239)#240
zacharias-ona merged 2 commits into
mainfrom
feat/239-invite-copy-link

Conversation

@zacharias-ona
Copy link
Copy Markdown
Collaborator

@zacharias-ona zacharias-ona commented Apr 19, 2026

Closes #239

What

Adds the ability for workspace admins to copy invite links, both immediately after creating an invite and from the pending invites list.

How

Invite form (invite-form.tsx):

  • After a successful invite creation, the generated invite URL ({origin}/invite/{token}) is displayed inline below the form with a copy button
  • The link clears when the user starts typing a new email

Pending invites list (pending-invite-list.tsx):

  • Each pending invite row now has a "Copy link" button (Copy icon) next to the existing revoke button
  • Uses the existing Tooltip component (base-ui pattern with render prop) for hover feedback
  • Icon transitions from Copy → Check with accent color for 2 seconds after copying

Both use navigator.clipboard.writeText() for clipboard access and clean up timers on unmount.

Testing

  • pnpm lint ✅
  • pnpm typecheck ✅
  • pnpm test — 252 tests pass ✅
  • No E2E tests added — clipboard interaction is a single-action UI pattern, not a multi-step flow

@vercel
Copy link
Copy Markdown

vercel Bot commented Apr 19, 2026 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
memo Ready Ready Preview, Comment Apr 19, 2026 2:36am

Request Review

zacharias-ona
zacharias-ona commented Apr 19, 2026
View reviewed changes
Comment thread src/components/members/invite-form.tsx Outdated
zacharias-ona
zacharias-ona commented Apr 19, 2026
View reviewed changes
Comment thread src/components/members/pending-invite-list.tsx Outdated
@zacharias-ona
Copy link
Copy Markdown
Collaborator Author

zacharias-ona commented Apr 19, 2026

Review: one issue to fix

Both clipboard write calls lack error handling. navigator.clipboard.writeText() can reject when the document isn't focused or clipboard permissions are denied, causing unhandled promise rejections.

  1. invite-form.tsx: Wrap handleCopyLink body in try/catch
  2. pending-invite-list.tsx: Wrap handleCopy body in try/catch

Everything else looks good — clean implementation, proper timer cleanup, correct design tokens, good accessibility labels. Fixing inline.

@zacharias-ona @ona-agent
fix: [ci-fix] add try/catch around navigator.clipboard.writeText calls
d92b14b 
clipboard.writeText() can reject when the document isn't focused or
permissions are denied. Wrap both call sites in try/catch to prevent
unhandled promise rejections. Added files to the bare-catch allowlist
since clipboard failures are intentionally silent.

Co-authored-by: Ona <no-reply@ona.com>
@zacharias-ona zacharias-ona merged commit 512a0a6 into main Apr 19, 2026
6 checks passed
@zacharias-ona zacharias-ona deleted the feat/239-invite-copy-link branch April 19, 2026 02:39
@zacharias-ona
Copy link
Copy Markdown
Collaborator Author

zacharias-ona commented Apr 19, 2026

✅ UI verification passed — design spec compliance confirmed.

Static analysis (2 changed UI files):

  • Color tokens: all values use CSS variables from the design spec (text-accent, text-muted-foreground, text-white/30)
  • Typography: text-xs, text-sm — within the allowed scale
  • Spacing: gap-1, gap-2, gap-3, w-20 — Tailwind scale only, no arbitrary values
  • Button variants: ghost for icon buttons (toolbar actions), default for submit — correct per spec
  • Icons: h-4 w-4 (16px) — matches spec
  • Accessibility: aria-label on both copy and revoke icon-only buttons
  • Component usage: shadcn Button, Tooltip, Table, Badge used correctly
  • No decorative animations, no box shadows, sharp corners throughout

Visual verification (Playwright screenshots — desktop 1280×800, mobile 375×812):

  • Desktop: invite form, members table, and pending invites table render correctly with proper alignment and spacing
  • Mobile: content adapts to narrow viewport; table overflow at mobile width is pre-existing (from feat: workspace members — invite, roles, management (#32) #51), not a regression from this PR
  • Dark mode tokens applied correctly throughout

@zacharias-ona zacharias-ona mentioned this pull request Apr 19, 2026
Closed
3 tasks
@zacharias-ona
Copy link
Copy Markdown
Collaborator Author

zacharias-ona commented Apr 19, 2026

❌ Post-merge verification failed.

E2E suite: 63 passed, 3 failed, 8 skipped (serial deps of failed tests)

Regression from this PR (1):

  • members.spec.ts > owner can invite a user by email — test expects "Invite sent." text which was replaced by the invite link display. This blocks 6 dependent serial tests.

Pre-existing failures unrelated to this PR (2):

  • search.spec.ts > search with no matches shows empty state — empty state text mismatch
  • workspace-settings.spec.ts > personal workspace shows 'cannot be deleted' message — test env issue (listUsers can't find test user)

Ad-hoc smoke tests: All passed (landing page, sign-in, health endpoint, authenticated login + workspace load).

See #241.

This was referenced Apr 19, 2026
Merged
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

feat: show copyable invite link in pending invites list

1 participant

@zacharias-ona